<template>
  <div class="container">
    <!-- 上边的盒子内容 -->
    <header class="header">
      <a-button type="primary" ghost>Primary</a-button>
      <a-button ghost>Default</a-button>
      <a-button type="dashed" ghost>Dashed</a-button>
      <a-button type="primary" danger ghost>Danger</a-button>
      <a-input v-model:value="data.value" placeholder="搜索" />
    </header>

    <!-- 页面主要内容 -->
    <section class="content">
      <el-button>Default1</el-button>
      <el-button type="primary">Primary</el-button>
      <el-button type="success">Success</el-button>
      <el-button type="info">Info</el-button>
      <el-button type="warning">Warning</el-button>
      <el-button type="danger">Danger</el-button>
      <div>{{ useUserStore().userInfo.name }}</div>
      <div>{{ useUserStore().userInfo.phone }}</div>
    </section>
    <!-- 页面底部内容 -->
    <!-- <footer class="footer">
      <div class="footer-content">本服务由XXX市提供</div>
    </footer> -->
  </div>
</template>

<script setup>
import { getUserInfo, getToken } from '@/api/getUserInfo'
import { serveAPI } from '@/api/serve'
import tools, { name, IdNumberDesensitization, phone } from '@/tools/tool'
import { useUserStore } from '@/store/index'

const data = reactive({
  userInfo: {},
  value: useUserStore().userInfo.phone
})
// 获取用户信息
async function getUser() {
  await getUserInfo().then(async res => {
    // 获取token
    await getToken().then(result => {
      if (res.code == '200' && res.success) {
        // 判断用户类型1：个人用户 2：企业用户
        if (res.params.userType == '1') {
          let userInfo = res.params
          userInfo.name = name(tools.decryptSM2(res.params.userName))
          userInfo.card = IdNumberDesensitization(tools.decryptSM2(res.params.userId))
          userInfo.phone = phone(tools.decryptSM2(res.params.phone))
          userInfo.authCode = tools.decryptSM2(
            result.data.authCode,
            '0e967306db2ed5f93efb8eb41a1043cf4782824a5c5e41874ab3305e4db6e6e7'
          )
          userInfo.token = tools.decryptSM2(
            result.data.token,
            '0e967306db2ed5f93efb8eb41a1043cf4782824a5c5e41874ab3305e4db6e6e7'
          )
          console.log('用户信息', userInfo)
          // 将userInfo存储到userInfo中
          data.userInfo = userInfo
          console.log(data, 'data中的数据')
          // 使用pinia,将信息存储到pinia中
          useUserStore().setUserInfo(userInfo)
          // 读取存储在pinia中的userInfo
          console.log('读取存储在pinia中的userInfo', useUserStore().userInfo)
          getList()
        } else {
          this.$message.warning('该业务仅限个人用户办理')
        }
      } else {
        location.href =
          'https://zwfw.gansu.gov.cn/szgs/member/wwLogin/againLgin.do?againUrl=' + encodeURIComponent(location.href)
      }
    })
  })
}

// getUser() // 获取用户信息

// 获取列表信息
function getList() {
  let params = {
    param:
      '0429a52f93d8de0d266a58384a63a66a435e1e71023a84fd6854776726f4aa41ee0056ea1a7477b5a0227fe14515acc0068a2bc564e4d83913e682a303eeb3d955451a4ab0bf1546cedad8e2e0de1bb07a6c1e8c53fb5ad6745c578ceee0aea9f8dc3c63341160910013af6178f72b0c1eca0481611b03afe72a631cc57e5e461b86e4c8ecbd61b5cdf0294ed6508feaaa3c49132459cec7eae6a97c421a93ab1ec627da3f5c'
  }
  serveAPI.queryList('jygyy', 'jygyy-query', params).then(res => {
    console.log(res, '列表信息')
  })
}
getList()
</script>
<style scoped lang="less">
.container {
  display: flex;
  flex-direction: column;
  min-height: 100vh; /* 设置容器的最小高度为视口的100%，保证内容超出屏幕高度时也能撑开 */
  background-color: pink;
  text-align: center;
  // .header {
  //   /* 上边盒子的样式 */
  // }

  .content {
    flex: 1; /* 让内容部分充满剩余空间 */
    /* 主要内容的样式 */
  }
}
</style>
